<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<script type="text/javascript" src="__ROOT__/Apps/WebApp/View/default/js/jquery-1.7.2.min.js"></script>
	<title></title>
</head>
<body>
<button id="uploadphoto" style="width:200px;height: 200px">请点击上传图片</button>
<div class="imglist" id="previewImage"></div>
<input type="hidden" id="img_str" name="img_str">
<div id="imageUrl"></div>

</body>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
	var WST = ThinkPHP = window.Think = {
		"ROOT"   : "__ROOT__",
		"APP"    : "__APP__",
		"PUBLIC" : "__PUBLIC__",
		"DEEP"   : "{:C('URL_PATHINFO_DEPR')}",
		"MODEL"  : ["{:C('URL_MODEL')}", "{:C('URL_CASE_INSENSITIVE')}", "{:C('URL_HTML_SUFFIX')}"],
		"VAR"    : ["{:C('VAR_MODULE')}", "{:C('VAR_CONTROLLER')}", "{:C('VAR_ACTION')}"],
		"DEFAULT_IMG": "{:WSTDomain()}/{$CONF['goodsImg']}",
	}
	/*
	 * 注意：
	 * 1. 所有的JS接口只能在公众号绑定的域名下调用，公众号开发者需要先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
	 * 2. 如果发现在 Android 不能分享自定义内容，请到官网下载最新的包覆盖安装，Android 自定义分享接口需升级至 6.0.2.58 版本及以上。
	 * 3. 常见问题及完整 JS-SDK 文档地址：http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
	 *
	 * 开发中遇到问题详见文档“附录5-常见错误及解决办法”解决，如仍未能解决可通过以下渠道反馈：
	 * 邮箱地址：weixin-open@qq.com
	 * 邮件主题：【微信JS-SDK反馈】具体问题
	 * 邮件内容说明：用简明的语言描述问题所在，并交代清楚遇到该问题的场景，可附上截屏图片，微信团队会尽快处理你的反馈。
	 */
	wx.config({
		debug: false,
		appId: '<?php echo $signPackage["appId"];?>',
		timestamp: <?php echo $signPackage["timestamp"];?>,
	nonceStr: '<?php echo $signPackage["nonceStr"];?>',
			signature: '<?php echo $signPackage["signature"];?>',
			jsApiList: [
		// 所有要调用的 API 都要加到这个列表中
		'chooseImage','previewImage','uploadImage','downloadImage'
	]
	});
	var images = {
		localId: [],
		serverId: [],
		download:[]
	};
var str='';
	wx.ready(function () {
		$('#uploadphoto').click(function(){
			// 在这里调用 API
			wx.chooseImage({
				count: 9, // 默认9
				sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
				sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
				success: function (res) {
//				var localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
					images.localId = res.localIds;
//				alert('已选择 ' + res.localIds.length + ' 张图片');
					var i = 0, length = images.localId.length;
					images.serverId = [];
					function upload() {
						str+='<img src="'+ images.localId[i]+'" style="width:80px;height:80px" onclick="showimg(this)"/>'+ images.localId[i];
						$('#previewImage').append(str);
						str=''
						wx.uploadImage({
							localId: images.localId[i],
							success: function(res) {
								i++;
//							alert('已上传：' + i + '/' + length);
								images.serverId.push(res.serverId);
//							//下载
							$.post(Think.U('WebApp/BranPer/wxDownLoad'),{media_id:res.serverId}, function(data){
								alert(JSON.stringify(data))
								str+='<input type="text" value="'+data.purl+' class="purl" />';
								$('#imageUrl').append(str);
							})
								if (i < length) {
									upload();
								}else{
//								alert(images.download)
								}
							},
							fail: function(res) {
								alert(JSON.stringify(res));
							}
						});
					}
					upload();
				}
			});

		});
	})
	function showimg(obj){
		var imgArray = [];
		var curImageSrc = $(obj).attr('src');
		if (curImageSrc) {
			$('#previewImage img').each(function(index, el) {
				var itemSrc = $(this).attr('src');
				imgArray.push(itemSrc);
			});
			wx.previewImage({
				current: curImageSrc,
				urls: imgArray
			});
		}
	}
</script>
<script src="__PUBLIC__/js/think.js?v={$WST_V}"></script>
</html>


